<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>奥鹏网考系统 - 学生操作日志</title>
    <link rel="shortcut icon" href="favicon.ico" mce_href="/favicon.ico" type="image/x-icon" />

    <link href="//openexamcdn.open.com.cn/openexam/static/Content/bootstrap.min.css" rel="stylesheet" />
    <link href="//openexamcdn.open.com.cn/openexam/static/App/vendor/jquery.datetimepicker/jquery.datetimepicker.css" rel="stylesheet" />
</head>
<div class="container">
    <div class="page-header">
        <h1>
            奥鹏网考系统 <small>学生操作日志</small>
        </h1>
    </div>

    <form class="form-inline">
        <div class="form-group">
            <label for="txtExamSiteId">主办方ID：</label>
            <input type="text" class="form-control" id="txtAppId" name="appId" placeholder="主办方ID" />
        </div>
        <div class="form-group">
            <label for="txtLoginIp">登录IP：</label>
            <input type="text" class="form-control" id="txtIpAddress" name="ipAddress" placeholder="登录IP" />
        </div>
        <div class="form-group">
            <label for="txtLoginStatus">考生姓名：</label>
            <input type="text" class="form-control" id="txtExamineeName" name="examineeName" placeholder="考生姓名" />
        </div>
        <br />
        <br />
        <div class="form-group">
            <label for="txtBeginTime">开始时间：</label>
            <div class="input-group">
                <input type="text" class="form-control datetimepicker" id="txtBeginTime" name="beginTime" placeholder="开始时间" readonly="readonly" />
                <span class="input-group-btn">
                        <button type="button" class="btn btn-default btn-sm" onclick="javascript: document.getElementById('txtBeginTime').value = null;">
                            <i class="glyphicon glyphicon-remove"></i>
                        </button>
                    </span>
            </div>
        </div>
        <div class="form-group">
            <label for="txtEndTime">结束时间：</label>
            <div class="input-group">
                <input type="text" class="form-control datetimepicker" id="txtEndTime" name="endTime" placeholder="结束时间" readonly="readonly" />
                <span class="input-group-btn">
                        <button type="button" class="btn btn-default btn-sm" onclick="javascript: document.getElementById('txtEndTime').value = null;">
                            <i class="glyphicon glyphicon-remove"></i>
                        </button>
                    </span>
            </div>
        </div>
        <div class="form-group">
            <label for="txtLoginStatus">操作描述：</label>
            <input type="text" class="form-control" id="txtDescription" name="description" placeholder="操作描述" />
        </div>
        <button type="submit" class="btn btn-default">
            <i class="glyphicon glyphicon-search"></i>
            查询
        </button>
    </form>
    <hr />

    <h5>
        总计：<b id="examineeOperateLogCount"></b> 条记录
    </h5>

    <table class="table table-striped table-bordered table-hover" id="examineeOperatLogTable">
        <thead>
        <tr class="success">
            <th>序号</th>
            <th>主办方ID</th>
            <th>考生ID</th>
            <th>考生姓名</th>
            <th>登录IP</th>
            <th>操作时间</th>
            <th>操作行为描述</th>
            <th>SessionID</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>

<script src="//openexamcdn.open.com.cn/openexam/static/Scripts/jquery-1.12.4.min.js"></script>
<script src="//openexamcdn.open.com.cn/openexam/static/App/vendor/jquery.datetimepicker/jquery.datetimepicker.js"></script>
<script type="text/javascript">
    function GetQueryString(name) {
        var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return decodeURIComponent(r[2]);
        return null;
    }

    window.onload = function () {
        $('.datetimepicker').datetimepicker({
            lang: 'ch',
            step: 5
        });

        var appId = GetQueryString('appId');
        if (appId)
            document.getElementById('txtAppId').value = appId;

        var ipAddress = GetQueryString('ipAddress');
        if (ipAddress)
            document.getElementById('txtIpAddress').value = ipAddress;

        var examineeName = GetQueryString('examineeName');
        if (examineeName)
            document.getElementById('txtExamineeName').value = examineeName;

        var beginTime = GetQueryString('beginTime');
        if (beginTime) {
            beginTime = beginTime.replace('+', ' ');
            document.getElementById('txtBeginTime').value = beginTime;
        }

        var endTime = GetQueryString('endTime');
        if (endTime) {
            endTime = endTime.replace('+', ' ');
            document.getElementById('txtEndTime').value = endTime;
        }

        var description = GetQueryString('description');
        if (description)
            document.getElementById('txtDescription').value = description;

        getExamineeOperateLog(appId,ipAddress,examineeName,beginTime,endTime,description);
    };
    
    function getExamineeOperateLog(appId,ipAddress,examineeName,beginTime,endTime,description) {
        var $table = $("#examineeOperatLogTable");

        $.ajax({
            url:"/Home/ExamineeOperateLog",
            type:"POST",
            dataType:"json",
            data:{
                appId:appId,
                ipAddress:ipAddress,
                examineeName:examineeName,
                beginTime:beginTime,
                endTime:endTime,
                description:description
            },
            success:function (data) {
                var tbody = '';
                if(data.length > 0){
                    for (var i=0;i<data.length;i++){
                        tbody += '<tr>';
                        tbody += '<td>'+ (i+1) +'</td>';
                        tbody += '<td>'+ data[i].appID+'</td>';
                        tbody += '<td>'+ data[i].examineeID+'</td>';
                        tbody += '<td>'+ data[i].examineeName+'</td>';
                        tbody += '<td>'+ data[i].optIPAddress+'</td>';
                        tbody += '<td>'+ data[i].optTime+'</td>';
                        tbody += '<td>'+ data[i].optDescription+'</td>';
                        tbody += '<td>'+ data[i].sessionID+'</td>';
                        tbody += '</tr>';
                    }
                }else{
                    tbody += '<tr> <td colspan="8" style="text-align: center;">未查询到数据 </td> </tr>';
                }
                $("#examineeOperateLogCount").html(data.length);
                $table.find("tbody").append(tbody);
            }
        })
    }
</script>
</body>
</html>